<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
        <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
        <link rel="manifest" href="manifest.json"/>
        <link rel="icon" type="image/x-icon" sizes="180x180" href="./images/AppIcon@3x.png">

        <title>KotlinConf</title>

        <script type="text/javascript">
            // TODO required for ktor client
            window.process = {
                env: {},
                release: {}
            };
        </script>

        <style>
            @media (prefers-color-scheme: dark) {
                body {
                    background-color: #000;
                }
            }

            @media (prefers-color-scheme: light) {
                body {
                    background-color: #FFF;
                }
            }

            html, body {
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 0;
                overflow: hidden;
                background-image: url("images/splash-screen.svg");
                background-repeat: no-repeat;
                background-position: center;
            }

            #warning {
                position: absolute;
                top: 100px;
                left: 100px;
                max-width: 830px;
                z-index: 100;
                background-color: white;
                font-size: initial;
                display: none;
            }
            #warning li {
                padding-bottom: 15px;
            }

            #warning span.code {
                font-family: monospace;
            }

            ul {
                margin-top: 0;
                margin-bottom: 15px;
            }

            #footer {
                position: fixed;
                bottom: 0;
                width: 100%;
                z-index: 1000;
                background-color: white;
                font-size: initial;
            }

            #close {
                position: absolute;
                top: 0;
                right: 10px;
                cursor: pointer;
            }
            .github-link {
                position: absolute;
                right: 10px;
                height: 25px;
                align-content: end;
            }
            .github-link a {
                color: black;
                text-decoration: none;
            }
            @media (prefers-color-scheme: dark) {
                .github-link {
                    filter: invert(100);
                }
            }
        </style>
    </head>
    <body>
        <div class="github-link">
            <a href="https://github.com/JetBrains/kotlinconf-app" target="_blank" title="https://github.com/JetBrains/kotlinconf-app">
                <svg height="16px" width="16px" viewBox="0 0 16 16">
                    <path d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"></path>
                </svg>
                Sources<svg width="14" height="10" viewBox="0 0 14 14">
                    <path d="M2 2H10.586L0 12.5L1.5 14L12 3.414V12L14 10V0H4L2 2Z" fill="black"/>
                </svg>
            </a>
        </div>
        <canvas id="ComposeTarget"></canvas>
        <script type="application/javascript">
            const unhandledError = (event, error) => {
                if (error instanceof WebAssembly.CompileError) {
                    document.getElementById("warning").style.display = "initial";

                    // Hide a Scary Webpack Overlay which is less informative in this case.
                    const webpackOverlay = document.getElementById("webpack-dev-server-client-overlay");
                    if (webpackOverlay != null) webpackOverlay.style.display = "none";
                }
            }
            addEventListener("error", (event) => unhandledError(event, event.error));
            addEventListener("unhandledrejection", (event) => unhandledError(event, event.reason));
        </script>

        <script type="application/javascript">
            if (typeof self.crypto.randomUUID == "undefined") {
                self.crypto.randomUUID = () => {
                    let count = 16;
                    const array = new Uint8Array(count);
                    const h = Array.from(self.crypto.getRandomValues(array)).map((v) => (v < 16 ? "0" : "") + v.toString(16))
                    let prev = 0;

                    // 36b8f84d-df4e-4d49-b662-bcde71a8764f
                    return [4, 2, 2, 2, 6].map((v) => {
                        const start = prev
                        prev += v
                        return h.slice(start, start + v).join("")
                    }).join("-")
                };
            }
            if (typeof Notification == "undefined") {
                self.Notification = class Notification {
                    static permission = "default";
                    static requestPermission() {}
                }
            }
        </script>

        <script type="application/javascript">
            const body = document.body

            /*
            Represents the next Wasm module:
            ```wat
            (module
              (type $type0 (struct (field $field0 i8))) ;; check [Garbage Collector](https://github.com/WebAssembly/gc/blob/main/proposals/gc/Overview.md) support
              (func $func0                              ;; check [Exception Handling](https://github.com/WebAssembly/exception-handling/blob/main/proposals/exception-handling/Exceptions.md) support 
                try
                catch_all
                end
              )
              (func $func1                              ;; check [Function References](https://github.com/WebAssembly/function-references/blob/main/proposals/function-references/Overview.md) support
                ref.null func
                drop
              )
            )
            ```

            You can use [wasm-tools](https://github.com/bytecodealliance/wasm-tools) to compile the text above into a binary:
            ```sh
            wasm-tools parse YOUR_WAT_WITH_THE_TEXT_ABOVE.wat > YOUR_WASM_WITH_THE_COMPILED_TEXT_ABOVE.wasm
            ```
            */
            const simpleWasmModule = new Uint8Array([
                0,  97, 115, 109,   1,   0,   0,  0,   1,   8,   2,  95,
                1, 120,   0,  96,   0,   0,   3,  3,   2,   1,   1,  10,
               14,   2,   6,   0,   6,  64,  25, 11,  11,   5,   0, 208,
              112,  26,  11,   0,  45,   4, 110, 97, 109, 101,   1,  15,
                2,   0,   5, 102, 117, 110,  99, 48,   1,   5, 102, 117,
              110,  99,  49,   4,   8,   1,   0,  5, 116, 121, 112, 101,
               48,  10,  11,   1,   0,   1,   0,  6, 102, 105, 101, 108,
              100,  48
            ])

            const hasSupportOfAllRequiredWasmFeatures = () => 
                typeof WebAssembly !== "undefined" &&
                typeof WebAssembly?.validate === "function" &&
                WebAssembly.validate(simpleWasmModule)

            const createScript = (src) => {
                const script = document.createElement("script")
                script.src = src
                script.type = "application/javascript"
                return script
            }

            if (hasSupportOfAllRequiredWasmFeatures()) {
                body.appendChild(createScript("kotlin-app-wasm-js.js"))
            } else {
                body.appendChild(createScript("skiko.js"))
                body.appendChild(createScript("kotlin-app-js.js"))
            }
        </script>
        <script type="application/javascript">
            if ("serviceWorker" in navigator) {
                window.addEventListener("load", () => navigator.serviceWorker.register("./service-worker.js"));
            }
        </script>
    </body>
</html>
